.footer {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 57px;
  background: #000;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
  .tab-bar {
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 5px 0;
    .tab-bar-item {
      height: 100%;
      color: rgba(254, 251, 255, .5);
      display: flex;
      align-items: center;
      flex-direction: column;
      padding-top: 26px;
      font-size: 12px;
      &:nth-child(1) {
        background: url('@images/tabbar/home.png') no-repeat center top;
        background-size: 24px auto;
      }
      &:nth-child(2) {
        background: url('@images/tabbar/mining.png') no-repeat center top;
        background-size: 24px auto;
      }
      &:nth-child(3) {
        background: url('@images/tabbar/property.png') no-repeat center top;
        background-size: 24px auto;
      }
      &:nth-child(4) {
        background: url('@images/tabbar/mine.png') no-repeat center top;
        background-size: 24px auto;
      }
    }
    .active {
      color: rgba(254, 251, 255, 1);
      &:nth-child(1) {
        background: url('@images/tabbar/home-active.png') no-repeat center top;
        background-size: 24px auto;
      }
      &:nth-child(2) {
        background: url('@images/tabbar/mining-active.png') no-repeat center top;
        background-size: 24px auto;
      }
      &:nth-child(3) {
        background: url('@images/tabbar/property-active.png') no-repeat center top;
        background-size: 24px auto;
      }
      &:nth-child(4) {
        background: url('@images/tabbar/mine-active.png') no-repeat center top;
        background-size: 24px auto;
      }
    }
  }
}